/*
 * @Author: zhaojiawei 
 * @Date: 2018-12-05 18:14:00 
 * @Last Modified by: zhaojiawei
 * @Last Modified time: 2018-12-06 23:24:28
 */


import React,{Component} from 'react';
import {
    Text,
    View,
    Image,
    StyleSheet,
    TouchableOpacity,
} from 'react-native';


export default class TrendingCell extends Component{
    render() {
        return  <TouchableOpacity
        //使用父组件的方法
              onPress={this.props.onSelect}
              style={styles.container}
        >     
        <View style={styles.cell_container}>
            <Text style={styles.title}>{this.props.data.fullName}</Text>
            <Text style={styles.description}>{this.props.data.description}</Text>
            <View style={{flexDirection:'row',justifyContent:'space-between'}}>
                <View style={{flexDirection:'row',alignItems:'center'}}>
                    <Text>作者：</Text>
                    {this.props.data.contributors.map((result,i,arr)=>{
                        return <Image
                              style={{height:22,width:22}}
                              source={{uri:arr[i]}}
                        />
                    })}
                </View>
                <View style={{flexDirection:'row',alignItems:'center'}}>
                    <Text>Stars:</Text>
                    <Text>{this.props.data.meta}</Text>
                </View>
                <Image style={{width:22,height:22}} source={require('../../res/images/ic_star.png')}/>
            </View>
         </View>
         </TouchableOpacity>
    }
}

const styles=StyleSheet.create({
    container:{
        flex:1,
    },
    title:{
        fontSize:16,
        marginBottom:2,
        color:'#212121',
    },
    description:{
        fontSize:14,
        marginBottom:2,
        color:'#757575',
        borderRadius:2
    },
    cell_container:{
        backgroundColor:'white',
        padding:10,
        marginLeft:5,
        marginRight:5,
        marginVertical:3,
        borderWidth:0.5,
        borderRadius:5,
        borderColor:'#dddddd',
        shadowColor:'gray',
        shadowOffset:{width:0.5,height:0.5},
        shadowOpacity:0.4,
        shadowRadius:1,
    }
})